/**
 * Created by yeyingpc on 2017/6/7.
 */
import React, { Component } from 'react';
import { StatusBar } from 'react-native';
import { TabNavigator, TabBarBottom, StackNavigator } from 'react-navigation';

import HomeScene from './home/HomeScene';
import NearbyScene from './nearby/NearbyScene';
import TabBarIcon from './common/TabBarIcon';

class RootScene extends Component {
    constructor() {
        super();
        StatusBar.setBarStyle('dark-content');
    }
    render() {
        return (
            <Navigator/>
        )
    }
}

const color = {
    theme: '#06C1AE',
    border: '#e0e0e0',
    background: '#f3f3f3'
};
const Tab = TabNavigator(
    {
        Home: {
            screen: HomeScene,
            navigationOptions: ({ navigation }) => ({
                tabBarLabel: '团购',
                tabBarIcon: ({ focused, tintColor}) => (
                    <TabBarIcon
                        tintColor={tintColor}
                        focused={focused}
                        normalImage={require('./img/tabbar/pfb_tabbar_homepage@2x.png')}
                        selectedImage={require('./img/tabbar/pfb_tabbar_homepage_selected@2x.png')}
                    />
                )
            })
        },
        Nearby: {
            screen: NearbyScene,
            navigationOptions: ({ navigation }) => ({
                tabBarLabel: '附近',
                tabBarIcon: ({ focused, tintColor}) => (
                    <TabBarIcon
                        tintColor={tintColor}
                        focused={focused}
                        normalImage={require('./img/tabbar/pfb_tabbar_merchant@2x.png')}
                        selectedImage={require('./img/tabbar/pfb_tabbar_merchant_selected@2x.png')}
                    />
                )
            })
        }
    },
    {
        tabBarComponent: TabBarBottom,
        tabBarPosition: 'bottom',
        swipeEnabled: true,
        animationEnabled: true,
        lazy: true,
        tabBarOptions: {
            activeTintColor: color.theme,
            inactiveTintColor: '#979797',
            style: { background: '#ffffff'},
        },
    }
);

const Navigator = StackNavigator(
    {
        Tab: { screen: Tab },
    },
    {
        navigationOptions: {
            headerBackTitle: null,
            headerTintColor: '#333333',
            showIcon: true
        }
    }
);



export default RootScene;